<template>
  <el-dialog
    top="80px"
    :visible.sync="isVisible"
    :title="title"
    :close-on-click-modal="false"
    :close-on-press-escape="false"
  >
    <el-container>
      <el-main :style="{ 'max-height': maxHeightDialog }">
        <t-detail
          v-if="dataList.length != 0"
          :list="dataList"
          :is-title="true"
          :title="'基本信息'"
          :is-card-border="true"
        >
          <template v-if="item.value != ''" slot="status" slot-scope="{ item }">
            <el-tag
              size="medium"
              :style="item.value | constantKeyTagStyleObj('ORDER_STATUS')"
            >
              {{ item.value | constantKeyValue('ORDER_STATUS') }}
            </el-tag>
          </template>
          <template slot="deviceStatus" slot-scope="{ item }">
            <el-tag
              size="medium"
              :style="item.value | constantKeyTagStyleObj('WARNING_TYPE')"
            >
              {{ item.value | constantKeyValue('WARNING_TYPE') }}
            </el-tag>
          </template>
          <template
            v-if="item.value != '' || item.value == 0"
            slot="urgency"
            slot-scope="{ item }"
          >
            <el-tag
              size="medium"
              :style="item.value | constantKeyTagStyleObj('URGENCY')"
            >
              {{ item.value | constantKeyValue('URGENCY') }}
            </el-tag>
          </template>
          <template
            v-if="item.value != ''"
            slot="alarmOccurTime"
            slot-scope="{ item }"
          >
            {{ item.value | datefmt('YYYY-MM-DD HH:mm:ss') }}
          </template>
          <template
            v-if="item.value != ''"
            slot="confirmTime"
            slot-scope="{ item }"
          >
            {{ item.value | datefmt('YYYY-MM-DD HH:mm:ss') }}
          </template>
          <template
            v-if="item.value != ''"
            slot="assigneeTime"
            slot-scope="{ item }"
          >
            {{ item.value | datefmt('YYYY-MM-DD HH:mm:ss') }}
          </template>
          <template
            v-if="item.value != ''"
            slot="jobReplyTime"
            slot-scope="{ item }"
          >
            {{ item.value | datefmt('YYYY-MM-DD HH:mm:ss') }}
          </template>
          <template
            v-if="item.value != ''"
            slot="auditTime"
            slot-scope="{ item }"
          >
            {{ item.value | datefmt('YYYY-MM-DD HH:mm:ss') }}
          </template>
          <template
            v-if="item.value != ''"
            slot="createdTime"
            slot-scope="{ item }"
          >
            {{ item.value | datefmt('YYYY-MM-DD HH:mm:ss') }}
          </template>
        </t-detail>
        <t-detail
          v-if="orderProcessingInfo.length != 0"
          :list="orderProcessingInfo"
          :is-title="true"
          :title="'工单处理信息'"
          :is-card-border="true"
        >
        </t-detail>
        <t-detail
          v-if="deviceInfo.length != 0"
          :list="deviceInfo"
          :is-title="true"
          :title="'设备信息'"
          :is-card-border="true"
        >
          <template
            v-if="item.value != '' && item.value && item.value != '-'"
            slot="deviceStatus"
            slot-scope="{ item }"
          >
            <el-tag
              size="small"
              :style="item.value | constantKeyTagStyleObj('DEVICE_STATUS')"
            >
              {{ item.value | constantKeyValue('DEVICE_STATUS') }}
            </el-tag>
          </template>
        </t-detail>
      </el-main>
      <el-footer>
        <el-button
          size="medium"
          icon="el-icon-close"
          style="width: 120px"
          @click="isVisible = false"
        >
          关闭
        </el-button>
      </el-footer>
    </el-container>
  </el-dialog>
</template>
<script>
import deviceManageApi from '@/api/device-manage'
import TDetail from '@/components/TDetail'
import dataDetailMixins from '@/mixins/data-detail-mixins'
export default {
  components: {
    TDetail,
  },
  mixins: [dataDetailMixins],
  props: {
    dialogVisible: {
      type: Boolean,
      default: false,
    },
    title: {
      type: String,
      default: '',
    },
    params: {
      type: Object,
      default: () => {
        return {}
      },
    },
  },
  data() {
    return {
      dataList: this.getDetailList(),
      deviceInfo: this.getDeviceInfo(),
      orderProcessingInfo: [],
      alarmReasonList: [
        {
          label: '实际报警',
          value: 1,
        },
        {
          label: '误报报警',
          value: 2,
        },
      ], // 报警原因
      dictList: [], // 实际情况描述
      resultDictData: [], // 处理结果
    }
  },
  computed: {
    isVisible: {
      get() {
        return this.dialogVisible
      },
      set() {
        this.toClose()
      },
    },
  },
  mounted() {
    this.getOrderProcessingInfo()
  },
  methods: {
    getDetailList() {
      console.log(this.params)
      const list = [
        [
          { text: '工单编号', value: this.params.alramCode || '-' },
          { text: '工单状态', value: this.params.status, slotName: 'status' },
        ],
        [
          {
            text: '告警时间',
            value: this.params.alarmOccurTime,
            slotName: 'alarmOccurTime',
          },
          { text: '告警地点', value: this.params.alarmLocation || '-' },
        ],
        [
          {
            text: '告警类型',
            value: this.params.deviceStatus,
            slotName: 'deviceStatus',
          },
          { text: '紧急程度', value: this.params.urgency, slotName: 'urgency' },
        ],

        [
          {
            text: '派单时间',
            value: this.params.confirmTime,
            slotName: 'confirmTime',
          },
          { text: '派单人', value: this.params.confirmUser || '-' },
        ],
        [
          {
            text: '受理时间',
            value: this.params.assigneeTime,
            slotName: 'assigneeTime',
          },
          { text: '受理人', value: this.params.assigneeUserName || '-' },
        ],
        [
          {
            text: '回单时间',
            value: this.params.jobReplyTime,
            slotName: 'jobReplyTime',
          },
          { text: '回单人', value: this.params.jobReplyUserName },
        ],
        // [
        //   { text: '审核人', value: this.params.auditUserName },
        //   {
        //     text: '审核时间',
        //     value: this.params.auditTime,
        //     slotName: 'auditTime'
        //   }
        // ],
        [
          {
            text: '创建时间',
            value: this.params.createdTime,
            slotName: 'createdTime',
          },
          { text: '创建人', value: this.params.createdUser },
        ],
        [
          // { text: '审核意见', value: this.params.auditOpinion },
          { text: '备注', value: this.params.remarks },
          {},
        ],
        // []
      ]
      return list
    },
    getDeviceInfo() {
      const list = [
        [
          { text: '设备编号', value: this.params.deviceSource || '-' },
          { text: '设备名称', value: this.params.deviceName || '-' },
        ],
        [
          {
            text: '设备状态',
            value: this.params.deviceStatus || '-',
            slotName: 'deviceStatus',
          },
          { text: '设备地址', value: this.params.deviceAddress || '-' },
        ],
      ]
      return list
    },
    getOrderProcessingInfo() {
      this.getDictList()
    },
    getDictList() {
      const data = {
        fieldName: 'alarm_actual_desc_2', // + String(this.params.alarmAttr),
        tableName: 't_job_reply',
      }
      deviceManageApi
        .getDictValueAttr(data)
        .then((data) => {
          this.dictList = data.data.dictValue
          this.getResultDictData()
        })
        .catch(() => {})
    },
    getResultDictData() {
      const data = {
        fieldName: 'process_result',
        tableName: 't_job_reply',
      }
      deviceManageApi.getDictValueAttr(data).then((r) => {
        this.resultDictData = r.data.dictValue
        this.toGetOrderInfo()
      })
    },
    toGetOrderInfo() {
      console.log('params>>', this.params) // alarmAttr-报警原因  alarmActualDesc-实际情况描述 processResult-处理结果
      let alarmReason = ''
      this.alarmReasonList.forEach((ele) => {
        if (ele.value == this.params.alarmAttr) {
          alarmReason = ele.label
        }
      })

      let alarmActualDesc = ''
      if (this.params.alarmActualDesc == 0) {
        alarmActualDesc = this.params.alarmActualRemark
      } else {
        this.dictList.forEach((ele) => {
          if (ele.dictValue == this.params.alarmActualDesc) {
            alarmActualDesc = ele.dictText
          }
        })
      }

      let processResult = ''
      this.resultDictData.forEach((ele) => {
        if (ele.dictValue == this.params.processResult) {
          processResult = ele.dictText
        }
      })

      const list = [
        [
          { text: '报警原因', value: alarmReason || '-' },
          { text: '实际情况描述', value: alarmActualDesc || '-' },
        ],
        [
          { text: '处理结果', value: processResult || '-' },
          { text: '', value: '' },
        ],
      ]

      this.orderProcessingInfo = list
    },
    toClose() {
      this.$emit('close')
    },
  },
}
</script>
<style lang="scss" scoped>
@import '../../../../styles/part-custom';
</style>
